<template>
	<div class="uploader-list">
		<slot :file-list="fileList">
			<ul>
				<li v-for="file in fileList" :key="file.id">
					<uploader-file :file="file" :list="true"></uploader-file>
				</li>
			</ul>
		</slot>
	</div>
</template>
<script setup name="uploader-list">
import { computed, inject, watch } from 'vue';
import UploaderFile from './file.vue';
const uploader = inject('uploader');
const fileList = computed(() => {
	return uploader.fileList;
});

const clearFileList = () => {
	console.log('清空文件list');
	uploader.fileList = [];
};

defineExpose({
	clearFileList,
});
</script>

<style>
.uploader-list {
	position: relative;
}
.uploader-list > ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
</style>
